<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/reset.css" media="screen" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/wap.style.css" media="screen" />
<link type="text/css" href="${pageContext.request.contextPath}/css/jquery-ui.css" media="screen" rel="stylesheet" />
<!-- JavaScript Plugins -->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/wap.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/charging.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.placeholder.js"></script>


		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-ui-1.8.16.custom.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.blockUI.js"></script>
		

<title>Login Page</title>

</head>

<body>
	<div id="wap-login">
    	<h1>Đăng nhập</h1>
        
    	<div id="wap-login-form">
        	<form class="wap-form" action="login" method="post">
                <div class="wap-form-row">
                	<div class="wap-form-item large">
                    	<input type="text" id="username" name="username" class="wap-login-username wap-textinput" placeholder="Tên đăng nhập" />
                    </div>
                </div>
                <div class="wap-form-row">
                	<div class="wap-form-item large">
                    	<input type="password" id="password" name="password" class="wap-login-password wap-textinput" placeholder="Mật khẩu" />
                    </div>
                </div>
                <div class="wap-form-row">
                	<input type="button" id="loginBtn" value="Đăng nhập" class="wap-button red wap-login-button" />
                </div>
            </form>
        </div>
    </div>
    <div id="alert"></div>
    <script type="text/javascript" charset="utf-8">
			$("#loginBtn").click(function(e){
				
				var username = $("#username").val().trim();
				var passwd = $("#password").val().trim();
				$.post("login", { 'username': username, 
									 'password': passwd
									},
					function(data) {
						$.unblockUI({ fadeOut: 200 });
						$("#alert").html(data); 
					}
				);
				
				 $.blockUI({ 
				  	message: 'Xin bạn chờ trong giây lát',
				 	css: { 
			            border: 'none', 
			            padding: '15px', 
			            backgroundColor: '#000', 
			            '-webkit-border-radius': '10px', 
			            '-moz-border-radius': '10px', 
			            opacity: .5, 
			            color: '#fff' 
		        	} 
		        }); 
			});
		</script>
</body>
</html>
